<!-- Content Wrapper. Contains page content -->
<div id="inner-container">
    <div class="row">
        <div class="col-md-3">
            <div class="row">
                <div class="col-md-4">
                    <button class="btn btn-success btn-block margin-bottom" ng-click="newUser()">
                        New
                    </button>
                </div>
                <div class="col-md-4">
                    <button class="btn btn-success btn-block margin-bottom" ng-click="editUser(selectUser[0])">
                        Edit
                    </button>
                </div>
                <div class="col-md-4">
                    <button class="btn btn-success btn-block margin-bottom" ng-click="deleteUser()">
                        Delete
                    </button>
                </div>
            </div>
            <div class="row" style="margin-bottom: 10px">
                <div class="col-md-12">
                    <div class="input-group">
                        <span class="input-group-addon">{{'CONFIG.WIDGET.FIND'|translate}}</span>
                        <input type="text" class="form-control" ng-model="userKeyword">
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <select multiple class="form-control" ng-model="selectUser" ng-change="changeRoleSelect()"
                            ng-options="u.loginName+'('+u.userName+')' for u in userList | filter:{loginName:userKeyword}" style="height: 500px">
                    </select>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="row">
                <div class="col-md-3">
                    <button class="btn btn-success btn-block margin-bottom" ng-click="newRole()">
                        New
                    </button>
                </div>
                <div class="col-md-3">
                    <button class="btn btn-success btn-block margin-bottom" ng-click="editRole(selectRole[0])">
                        Edit
                    </button>
                </div>
                <div class="col-md-3">
                    <button class="btn btn-success btn-block margin-bottom" ng-click="deleteUser()">
                        Delete
                    </button>
                </div>
                <div class="col-md-3">
                    <button class="btn btn-success btn-block margin-bottom" ng-click="grant()">
                        Grant
                    </button>
                </div>
            </div>
            <div class="row" style="margin-bottom: 10px">
                <div class="col-md-12">
                    <div class="input-group">
                        <span class="input-group-addon">{{'CONFIG.WIDGET.FIND'|translate}}</span>
                        <input type="text" class="form-control" ng-model="roleKeyword">
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <select multiple class="form-control" ng-model="selectRole"
                            ng-options="u.roleName for u in roleList | filter:{roleName:roleKeyword}" style="height: 500px">
                    </select>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="box" ng-show="optFlag == 'newUser' || optFlag == 'editUser'">
                <div class="box-header with-border">
                    <h3 class="box-title"></h3>
                </div>
                <div class="box-body">
                    <div class="row">
                        <div class="col-md-12 form-horizontal">
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="form-group"
                                         ng-class="{'has-error': !(verify.dsName || curDataset.name.length)}">
                                        <label class="col-sm-2 control-label">{{'ADMIN.USER.LOGIN_NAME'|translate}}</label>
                                        <div class="col-sm-10">
                                            <input ng-model="curUser.loginName" class="form-control"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="form-group"
                                         ng-class="{'has-error': !(verify.dsName || curDataset.name.length)}">
                                        <label class="col-sm-2 control-label">{{'ADMIN.USER.NAME'|translate}}</label>
                                        <div class="col-sm-10">
                                            <input ng-model="curUser.userName" class="form-control"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row" ng-show="optFlag == 'newUser'">
                                <div class="col-md-12">
                                    <div class="form-group"
                                         ng-class="{'has-error': !(verify.dsName || curDataset.name.length)}">
                                        <label class="col-sm-2 control-label">{{'ADMIN.USER.PASSWORD'|translate}}</label>
                                        <div class="col-sm-10">
                                            <input ng-model="curUser.userPassword" class="form-control" type="password"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /.box-body -->
                <div class="box-footer">
                    <button type="submit" class="btn btn-danger pull-right">{{'COMMON.CANCEL'|translate}}</button>
                    <button type="submit" ng-click="saveUser()" class="btn btn-success pull-right"
                            style="margin-right: 5px">{{'COMMON.SAVE'|translate}}
                    </button>
                </div>
                <!-- /.box-footer-->
            </div>

            <div class="box" ng-show="optFlag == 'newRole' || optFlag == 'editRole'">
                <div class="box-header with-border">
                    <h3 class="box-title"></h3>
                </div>
                <div class="box-body">
                    <div class="row">
                        <div class="col-md-12 form-horizontal">
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="form-group"
                                         ng-class="{'has-error': !(verify.dsName || curDataset.name.length)}">
                                        <label class="col-sm-2 control-label">{{'ADMIN.ROLE.ROLE_NAME'|translate}}</label>
                                        <div class="col-sm-10">
                                            <input ng-model="curRole.roleName" class="form-control"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /.box-body -->
                <div class="box-footer">
                    <button type="submit" class="btn btn-danger pull-right">{{'COMMON.CANCEL'|translate}}</button>
                    <button type="submit" ng-click="saveRole()" class="btn btn-success pull-right"
                            style="margin-right: 5px">{{'COMMON.SAVE'|translate}}
                    </button>
                </div>
                <!-- /.box-footer-->
            </div>
        </div>
    </div>
</div>

</div>
